<template>
    <router-view></router-view>
</template>
<script>
import Vue from 'vue'
export default {
    name: 'App',
    mounted() {
        this.listenMediaQueryList()
    },
    methods: {
        listenMediaQueryList() {
            const mediaQueryList = window.matchMedia("screen and (orientation: portrait)");
            if(mediaQueryList && mediaQueryList.addListener){
                this.handleListenMediaQueryList(mediaQueryList.matches)
                mediaQueryList.addListener(() => this.handleListenMediaQueryList(mediaQueryList.matches))
            }
        },
        handleListenMediaQueryList(match) {
            // 竖屏 用wap路由
            if (match && window.location.hash.indexOf('/wap') === -1) {
                this.$router.replace({
                    path: '/wap' + window.location.hash.replace('#', ''),
                    params: this.$route.params,
                    query: this.$route.query
                })
                Vue.prototype.screenMode = '|'
            }
            // 横屏 用普通路由
            if (!match && window.location.hash.indexOf('/wap') > -1) {
                this.$router.replace({
                    path: window.location.hash.replace('#/wap', ''),
                    params: this.$route.params,
                    query: this.$route.query
                })
                Vue.prototype.screenMode = '-'
            }
        }
    }
}
</script>

